<template> 
    <div>
        <Form ref="formValidate" :model="formValidate" :label-width="100" :rules="ruleValidate">
            <FormItem label="学生" prop="user_id">
                <div @click="infoId==false ?  othermodule=true : ''">
                    <RadioGroup v-model="formValidate.user_id" type="button" size="large">
                        <Radio :label="formValidate.user_id">{{username}}</Radio>
                    </RadioGroup>
                </div>
            </FormItem>

            <FormItem label="去向班级">
                <Cascader :data="gradelist_class" :load-data="loadData_class" @on-change="studentInfo_class" @on-visible-change="load_class"></Cascader>
            </FormItem>
            <FormItem label="调班时间" prop="eclass_time">
                <DatePicker v-model="formValidate.eclass_time"  type="date"  placeholder="请选择异动时间" style="width:100%" @on-change='getTime'></DatePicker>
            </FormItem>
            <FormItem label="调班原因"
             prop="reason.zh">
                <Input v-model="formValidate.reason.zh" placeholder="异动原因"></Input>
            </FormItem>

            <div style="width:90%;">
                <FormItem style="width:100%;">
                    <Button type="primary" @click="handleSubmit('formValidate')">保存</Button>
                </FormItem>
            </div>
            <div style="clear:both"></div>
            <Spin size="large" fix v-if="spinShow"></Spin>
        </Form> 
        <Modal v-model="othermodule" title="请选择学生" width="350">
            <student-module @on-select="othermodulebutton"></student-module>
        </Modal> 

    </div>
</template>
<script>
  export default {
    props: {
        infoId: {
            type: [Boolean,Number,String],
            default: false
        }
    },
    components: {	
        StudentModule: resolve => {require(['&/Authpub/StudentModule.vue'], resolve);},

    },
    data() {
        return {
            infoUrl:`api/student/v1/studentlearnstatus/move_classlists/${this.infoId}`,//请求单条数据
            saveUrl:'',//保存接口
            saveType:null,//保存方式

            othermodule:false,
            username:'请选择学生',

            spinShow:false,//加载动画

            gradelist_class:[],//年级


            infoOld:[],//单挑请求的数据

            formValidate: {
                user_id:null,//学生id
                go_eclass:null,//异动状态
                eclass_time:null,//异动时间
                reason:{
                    zh:'',
                    mn:'',
                    en:'',
                },//异动原因     
            },
            ruleValidate: {
                'reason.zh': [
                    { required: true, message: '异动原因不得为空', trigger: 'blur' }
                ],
                eclass_time: [
                    { required: true, type: 'string', message: '请选择异动时间', trigger: 'blur' }
                ],
            
            },
        }
    },
    methods: {
        getTime(val){
            this.formValidate.eclass_time = val
        },
        /************************************************************
         * 
         * 加载年级
         * 
         ************************************************************/
        load_class() {   
            // this.spinShow=true//输入框禁用       
            this.$http.get('api/base/v1/get/grade/list')
            .then((response) => {
                this.gradelist_class=this.process_class(response.data)
                this.spinShow=false
            })
            .catch(err=>{
                
                if(err.code && err.code==422) {
                    this.$Message.error(err.message);
                }
                // this.spinShow=false
            })
        },
        /************************************************************
         * 
         * 处理数据
         * 
         ************************************************************/
        process_class(data) {
            let arr = []
            data.forEach(item => {
                arr.push({
                    value : item.id,
                    label : item.grade_name.zh,
                    children : [],
                    loading: false,
                    type: false
                })
            })
            return arr
        },
        /************************************************************
         * 
         * 异步加载班级
         * 
         ************************************************************/
        loadData_class(item, callback) {
            // 点击的年级
            if(item.type == false){
                this.$http.get('api/eclass/v1/eclass/grade_eclass?grade_id='+item.value)
                .then((response) => {
                    if(response.data.length===undefined){
                        item.children.push({
                            value : '',
                            label : '',
                            type:true
                        })
                    }else{
                        response.data.forEach(item1 => {
                            item.children.push({
                                value : item1.eclass_id,
                                label : item1.eclass_name.zh,
                                // children : [],
                                // loading: false,
                                type:true
                            })
                        })
                    }
                    callback();
                })
                .catch(err=>{
                    
                    if(err.code && err.code==422) {
                        this.$Message.error(err.message);
                    }
                })
            }
        },
        /************************************************************
         * 
         * 给班级赋值
         * 
         ************************************************************/
        studentInfo_class(value,selectedData){
            this.formValidate.go_eclass=value[1]
        },

        /************************************************************
         * 
         * 提交时
         * 
         ************************************************************/
        handleSubmit (name) {
            this.$refs[name].validate((valid) => {
                if (valid) {       
                    this.spinShow=true//输入框禁用     
                    this.saveType(this.saveUrl,this.formValidate).then(val=>{
                        this.$emit('showParent',false)
                        this.$emit('backList',true)
                        this.$Message.success(val.message);
                        this.spinShow=false
                    }).catch(err => {
                        if (err.code && err.code == 422) {
                            this.$Message.error(err.message);
                        }
                        this.spinShow=false
                    })
                } else {
                    this.$Message.error('表单验证失败!');
                }
            })
        },
        
        /************************************************************
         * 
         * 单条数据请求
         * 
         ************************************************************/
        infoData(){
            this.spinShow=true//输入框禁用 
            this.$http.get(this.infoUrl).then(val=>{   
                delete this.formValidate.user_id 
                this.infoOld = JSON.parse(JSON.stringify(val.data))
                this.username=this.infoOld.user ? this.infoOld.user.student_name.zh : '请选择学生'
                this.infoOld = JSON.parse(JSON.stringify(val.data))
                this.formValidate.eclass_time = this.infoOld.eclass_time//异动时间
                if(this.infoOld.transaction_type!=null){
                    this.formValidate.transaction_type = parseInt(this.infoOld.transaction_type.dictionary_id)//异动状态
                }
                this.formValidate.reason.zh = this.infoOld.reason//异动原因

                this.spinShow=false//输入框禁用          
            }).catch(err=>{
                
                if(err.code && err.code==422) {
                     this.$Message.error(err.message);
                }
                this.spinShow = false;
            })
        },
            
        /************************************************************
         * 
         * 点击班级执行
         * 
         ************************************************************/
        othermodulebutton(val){
            this.formValidate.user_id=val.value.toString()
            this.username=val.lable.zh
            this.othermodule=false
        },
    },
    created() {
        this.load_class()
        if(this.infoId==false){
            // add
            this.saveUrl='api/student/v1/studentlearnstatus/move_eclasscreate'
            this.saveType=this.$http.post

        }else{
            // edit
            this.infoData();
            this.saveUrl=`api/student/v1/studentlearnstatus/move_eclassupdate/${this.infoId}`
            this.saveType=this.$http.put
        }
    },
  }
</script>